<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /*

            proxy 代理
        */

        var obj = { a: 1, b: 2 };

        let proxyObj = new Proxy(obj, {
            set(target, key, value) {
                console.log('set');
                console.log(target);
                console.log(key, value);

                target[key] = value;
            },
            get(target, key) {
                console.log('get');

                return target[key]

            }
        })

        // console.log(proxyObj);

        // proxyObj.a = 100;

        // console.log(proxyObj.a);


        function ob(obj) {
            let proxyObj = new Proxy(obj, {
                set(target, key, value) {
                    console.log('set');
                    console.log(target);
                    console.log(key, value);

                    target[key] = value;

                    return true;
                },
                get(target, key) {
                    console.log('get');

                    return target[key]

                }
            })

            return proxyObj

        }

        var arr = [9, 8, 7];

        let newArr = ob(arr);
        // newArr[6] = 1000

        // console.log(newArr[6]);


        newArr.push(1999)
    </script>

</body>

</html>